<template>
  <div id="mailBoxList">
    <div id="buttons">
      <el-button>新增收件箱</el-button>
      <el-button type="danger" :loading="restartMailTeakButtonLoading" @click="restart">重启收件任务</el-button>
    </div>
    
    <el-table :data="mailBoxList" stripe style="width: 100%">
      <el-table-column
        prop="mailBoxName"
        label="邮箱账号"
        align="left">
      </el-table-column>
      <el-table-column
        prop="lastUpdateTime"
        label="修改时间"
        align="left">
      </el-table-column>
      <el-table-column
        prop="isEnable"
        :formatter="isEnableFormatter"
        label="是否开启"
        align="left">
      </el-table-column>
      <el-table-column prop="isEnable" label="编辑" align="left">
        <template slot-scope="scope">
          <el-button size="mini" @click="handleEdit(scope.row.mailBoxName)">编辑</el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
export default {
  name: 'MailBox',
  data() {
    return {
      mailBoxList:[],
      restartMailTeakButtonLoading:false
    }
  },
  mounted: function () {
    this.getMailBoxs();
  },
  methods:{
    getMailBoxs:function(){
      this.$http.get("mailBox/all").then(res=>{
        this.mailBoxList = res.data.returnData;
        console.log(JSON.stringify(this.mailBoxList));
      });
    },
    isEnableFormatter:function(row){
      return row.isEnable=="1"?"ON":"OFF";
    },
    handleEdit:function(mailBoxName){
      console.log("编辑邮箱："+mailBoxName);
    },
    restart:function(){
      console.log("重启收件任务...");
      this.restartMailTeakButtonLoading = true;
      this.$http.get("state/restartMailTask").then(res=>{
        console.log("重启任务请求结果："+JSON.stringify(res.data));
        this.restartMailTeakButtonLoading = false;
      }).catch(error=>{
        console.error("重启任务发生异常！");
        this.restartMailTeakButtonLoading = false;
      });
    }
  }
}
</script>

<style>
#app {
  font-family: 'Avenir', Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
}
#buttons{
  text-align: left;
}
</style>
